<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>祺弄</title>
	</head>
	<link rel="stylesheet" href="../layui/css/layui.css" media="all">
	<link rel="stylesheet" type="text/css" href="../css/main.css" />
	<script src="../js/jquery.js" type="text/javascript" charset="utf-8"></script>
	<style>
		html,body{
			width: 100%;
			height:100%;
			overflow: hidden;
		}
		.layui-laydate-content td {
			color: #000 !important;
		}

		.layui-laydate-content .laydate-day-next,
		.layui-laydate-content .laydate-day-prev {
			color: #9e9e9e !important;
		}

		.laydate-theme-molv .layui-laydate-content {
			border: 0px solid #e2e2e2 !important;
			border-top: none;
			border-bottom: none;
		}

		.layui-laydate-content {
			padding: 0 0.625rem !important;
		}

		.laydate-theme-lunar .layui-laydate-main {
			width: auto;
		}

		.laydate-theme-lunar .date-cell-inner {
			padding: 0px;
			width: 44px;
			height: 40px;
			border-radius: 4px !important;
		}

		.laydate-theme-lunar .layui-this {
			border-radius: 4px !important;
		}

		.laydate-theme-lunar .date-cell-inner b {
			display: block;
			font-weight: 400;
			height: 16px;
			font-size: 14px;
		}

		.laydate-theme-lunar .date-cell-inner i {
			display: block;
			font-style: normal;
			font-size: 10px;
		}

		.laydate-theme-lunar .badge {
			position: absolute;
			right: 0px;
			top: 0px;
			background-color: #4e5877;
			color: #fff;
			font-size: 12px;
			line-height: 14px;
			padding: 1px 2px;
			border-radius: 4px;
			text-decoration: none;
			transform: scale(0.7);
		}

		.laydate-theme-lunar .holiday .badge {
			background-color: #eb3333 !important;
		}

		.laydate-theme-lunar .hightlight i {
			color: #1e9fff;
		}

		.laydate-theme-lunar .layui-this .hightlight i {
			color: #fff;
		}

		.laydate-theme-lunar .laydate-month-list>li {
			height: 50px !important;
			line-height: 50px !important;
			width: 24.2% !important;
			margin: 18px 1px !important;
		}

		.laydate-theme-lunar .laydate-year-list>li {
			height: 40px !important;
			line-height: normal !important;
			width: 31.3% !important;
			margin: 8px 2px !important;
		}

		.laydate-theme-lunar .preview-inner>* {
			display: inline-block;
			margin-right: 5px;
			position: relative;
			font-size: 12px;
		}

		.laydate-theme-lunar .preview-inner>.badge {
			margin-right: 0;
		}
		.layui-laydate, .layui-laydate-hint {
		    border: 0px solid #d2d2d2 !important;
		    box-shadow: 0 2px 4px rgba(0, 0, 0, .12);
		    background-color: #fff;
		    color: #777;
		}
		.layui-laydate-header {
		    border-bottom: 0px solid #e2e2e2 !important;
		}
		.layui-laydate-footer {
		    border-top: 0px solid #e2e2e2 !important;
		}
		.transparent-div {
		     background: rgba(255, 255, 255, .7);
		     opacity: 0.5;
		     width: 20%;
		     right: 0px;
		     position: fixed;
		     border-radius: 16px;
		     margin: 50px;
		     padding: 10px;
		}
		.strong-css{
			font-size: 21px;
			color: #444 !important;
			font-family: fangsong;
			font-style: normal;
			letter-spacing: 2px;
			line-height: 2.125rem;
			text-indent: 4ch;
		}
		.strong-css1{
			font-size: 21px;
			color: #444 !important;
			font-family: fangsong;
			font-style: normal;
			line-height: 6.25rem;
		}
	</style>

	<body id="main">
		<div id="box">
			
			<div id="time" class="time">
				<!-- 时间 -->
			</div>
			<div id="time1" class="time1">
				<!-- 时间 日期-->
			</div>
			<div id="time2" class="time2">
				<!-- 时间  农历-->
			</div>
			<div id="ID-laydate-cell-render" style="position: fixed;bottom: 0px;">
				<!-- 时间 日历-->
			</div>
			
			<!-- 右侧透明内容-->
			<div class="transparent-div" >
				<div>
					<div style="text-align: center;">
						<img style="border-radius: 16px;" src="https://api.vvhan.com/api/ipCard" alt="" />
						<!-- <strong id="ip-txt-strong-id" class="strong-css1"></strong> -->
					</div>
					<div style="margin-top: 1.25rem;" id="vvhan-div-id">
						<strong id="rand-txt-strong-id" class="strong-css"></strong>
					</div>
					<div>
						<!-- <strong id="weather-txt-strong-id" class="strong-css1"></strong> -->
					</div>
				</div>
				<div>
					<div style="margin-top: 1.25rem;">
						<strong id="rand-txt-strong-id1" class="strong-css"></strong>
					</div>
					
				</div>
				<div>
					<div style="margin-top: 1.25rem;">
						<strong id="rand-txt-strong-id2" class="strong-css"></strong>
					</div>
				</div>
				<div>
					<div style="margin-top: 1.25rem;">
						<strong id="rand-txt-strong-id3" class="strong-css"></strong>
					</div>
				</div>
				<div>
					<div style="margin-top: 1.25rem;">
						<!-- <strong id="rand-txt-strong-id4" class="strong-css"></strong> -->
						
					</div>
				</div>
				<div>
					<div style="margin-top: 1.25rem;">
						<strong id="weibo-title-div-id" class="strong-css">IT之家</strong>
						<div>
							<img id="RefreshClick" src="../images/Refresh.png" alt="" style="width: 35px;position: fixed;right: 0px;margin-right: 50px;cursor: pointer;"/>
						</div>
						<div id="weibo-div-id">
							
						</div>
						
						
					</div>
				</div>
			</div>
			
			
		</div>
		
		
		
	</body>
	

	<script src="../js/moment.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/moment-hijri.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/moment-with-locales.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/calendar.js" type="text/javascript" charset="utf-8"></script>
	<script src="../layui/lunar.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../layui/layui.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/main.js" type="text/javascript" charset="utf-8"></script>

	 
</html>